<template>
  <div>
    <!-- <van-nav-bar> -->

    <van-search
      show-action
      v-model="value"
      right-icon=""
      background="#21b97a"
      placeholder="请输入搜索关键词"
    >
      <template #left>
        <van-icon
          name="arrow-left"
          size="0.7rem"
          color="#fff"
          style="text-align: center"
        />
      </template>
      <template #action>
        <van-icon
          name="map-marked"
          size="0.7rem"
          color="#fff"
          style="line-height=54.8px"
        />
      </template>
    </van-search>

    <van-dropdown-menu>
  <van-dropdown-item v-model="value1" :options="option1" />
  <van-dropdown-item v-model="value2" :options="option2" />
  <!-- <van-dropdown-item v-model="value3" :options="option3" /> -->
  <!-- <van-dropdown-item v-model="value4" :options="option2" /> -->

</van-dropdown-menu>
    <userList v-for="item in SearchList" :title="item.name" :key="item.id" :item="item">
      <van-tabs v-model="active" animated sticky offset-top="1.226667rem">
        <van-tab >
        </van-tab>
      </van-tabs>
    </userList>
  </div>
</template>

<script>
import { SearchApi } from '@/api'
import userList from './userList.vue'
export default {
  components: {
    userList
  },
  data () {
    return {
      active: 0,
      value: '',
      str: { cityid: 'AREA|88cff55c-aaa4-e2e0' },
      str1: { id: 'AREA|88cff55c-aaa4-e2e0' },
      SearchList: [],
      value1: 0,
      value2: 'a',
      option1: [
        { text: '区域', value: 0 }

      ],
      option2: [
        { text: '方式', value: 'a' }

      ]
      // firstCod: [
      //   'a', 'b', 'c'

      // ],
      // newarr: []

    }
  },
  async created () {
    const res = await SearchApi(this.str)
    // console.log(res)
    this.SearchList = res.data.body.list
    // console.log(this.SearchList)
    // const res1 = await HouseChaxunApi(this.str1)
    // console.log(res1)
    // this.option1 = res1.data.data.body
  }
}
</script>

<style lang="less" scoped>
.van-icon-map-marked:before {
  margin-top: 5px;
}
</style>
